<html>
	<head>
		<meta
		  name="viewport"
		  content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover"
		/>
		<meta name="referrer" content="no-referrer">
		<script type="text/javascript" src="js/hls.min.js"></script>
		<script type="text/javascript" src="js/flv.min.js"></script>
		<script type="text/javascript" src="js/yb-player-gesture.js"></script>
		<script type="text/javascript" src="js/yb-player-danmu.js"></script>
		<script type="text/javascript" src="js/yb-player.js"></script>
		<script type="text/javascript" src="../js/swiper-bundle.min.js"></script>
		<script type="text/javascript" src="../js/uni-webview-js@1.5.4.js"></script>
		
		<link rel="stylesheet" href="../css/swiper-bundle.min.css" />
		<link rel="stylesheet" href="css/yb-player.css" />
		<link rel="stylesheet" href="css/yb-player-plugin.css" />
		<title>短视频</title>
		<style>
			html, body {
				padding: 0;
				margin: 0;
				background-color: #000;
				width: 100vw;
				height: 100vh;
			}
			.swiper {
				width: 100%;
				height: 100%;
				position: relative;
			}
			.slide_item {
				position: relative;
				display: flex;
				flex-direction: column;
			}
			.swiper-slide {
				background-color: #000;
			}
			.swiper-slide-wrapper {
				/* position: absolute;
				top: 0;
				left: 0;
				right: 0;
				height: 100%; */
				display: flex;
				flex-direction: column;
				justify-content: center;
			}
			
			.video_bottom {
				position: absolute;
				bottom: 0;
				left: 0;
				right: 0;
			}
			
			.video_info {
				color: #fff;
				display: flex;
				flex-direction: column;
				max-width: 80%;
				margin-left: 15px;
			}
			.video_info span {
				font-size: 14px;
				margin-bottom: 10px;
			}
			.video_info span:last-child {
				margin-bottom: 20px;
			}
			.video_info .subtitle {
				color: #eee;
			}
			.video_info .description {
				color: #ddd;
			}
			
			.controls {
				position: relative;
			}
			
			.controls_range_box {
				width: 100%;
				position: relative;
				height: 2px;
			}
			
			.controls_range_track {
				position: absolute;
				top: 0;
				left: 0;
				right: 0;
				bottom: 0;
				background-color: #999;
			}
			.controls_range_focus {
				position: absolute;
				top: 0;
				left: 0;
				bottom: 0;
				background-color: #fff;
				width: 0;
			}
			
			.controls_range:focus {
				outline: none;
			}
			
			.controls_range {
			    -webkit-appearance: none;
			    -moz-appearance: none;
			    appearance: none;
				background: none;
				outline: none;
				width: 100%;
				height: 2px;
				margin: 0;
				position: absolute;
				top: 0;
				bottom: 0;
				left: 0;
			}
			.controls_range::-webkit-slider-thumb {
				-webkit-appearance: none;
				height: 14px;
				width: 14px;
				border-radius: 14px;
				background: #fff;
			}
			.controls_range::-moz-range-thumb {
				height: 7px;
				width: 7px;
				border-radius: 8px;
				background: #fff;
			}
			.controls_range::-ms-thumb {
				height: 7px;
				width: 7px;
				border-radius: 8px;
				background: #fff;
			}
			
			.controls_bottom {
				display: flex;
				flex-direction: row;
				align-items: center;
				padding: 10px 15px;
				color: #fff;
			}
			.controls_bottom .btn {
				margin-left: 10px;
			}
			.controls_time {
				flex: 1;
				margin-left: 10px;
				margin-top: -2px;
			}
			.controls svg {
				width: 25px;
				height: 25px;
				fill: #fff;
			}
			
			.swiper-loading {
				color: #fff;
				position: absolute;
				left: 0;
				right: 0;
				z-index: -1;
				display: flex;
				align-items: center;
				justify-content: center;
			}
			
			.swiper-loading svg {
				width: 25px;
				height: 25px;
				margin-right: 10px;
				animation: rotate 1s linear infinite;
			}
			
			.swiper-loading span {
				margin-top: -2px;
			}
			
			.swiper-loading svg, .swiper-loading path {
				fill: #fff;
				stroke: #fff;
			}
			
			.swiper-pulldown {
				top: 20px;
			}
			
			.swiper-pullup {
				bottom: 20px;
			}
			
			@keyframes rotate {
				%0 {
					transform: rotate(0deg);
				}
			    100% {
			        transform: rotate(360deg);
			    }
			}
			
		</style>
	</head>
	<body>
		<!-- Specify the player container -->
		<div class="swiper">
			<div class="swiper-loading swiper-pulldown"></div>
		    <div class="swiper-wrapper">
		    </div>
			<div class="swiper-loading swiper-pullup"></div>
		    <!-- 如果需要分页器 -->
		    <!-- <div class="swiper-pagination"></div> -->
		</div>
		<script>
			var mySwiper, loadedVideos = new Map(), touchstartY, pulldownState, pullupState, initialLight, initialVolume, timeList = [];
			//开启全屏按钮
			var openfullIcon = `
				<svg viewBox="0 0 24 24">
				    <path d="M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z"/>
				</svg>
			`
			//播放按钮
			var playIcon = `
				<svg viewBox="0 0 24 24">
				    <path d="M8 5v14l11-7z"/>
				</svg>
			`
			//暂停按钮
			var pauseIcon = `
				<svg viewBox="0 0 24 24">
				    <path d="M6 19h4V5H6v14zm8-14v14h4V5h-4z"/>
				</svg>
			`
			//下载图标
			var downloadIcon = `
				<svg viewBox="0 0 24 24">
				    <path d="M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z"/>
				</svg>
			`
			var voiceIcon = `
				<svg viewBox="0 0 24 24">
				    <path d="M3 9v6h4l5 5V4L7 9H3zm13.5 3c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02zM14 3.23v2.06c2.89.86 5 3.54 5 6.71s-2.11 5.85-5 6.71v2.06c4.01-.91 7-4.49 7-8.77s-2.99-7.86-7-8.77z"/>
				</svg>
			`
			//加载图标
			var loadingIcon = `
				<svg t="1756110518162" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5422" width="48" height="48"><path d="M876.864 782.592c3.264 0 6.272-3.2 6.272-6.656 0-3.456-3.008-6.592-6.272-6.592-3.264 0-6.272 3.2-6.272 6.592 0 3.456 3.008 6.656 6.272 6.656z m-140.544 153.344c2.304 2.432 5.568 3.84 8.768 3.84a12.16 12.16 0 0 0 8.832-3.84 13.76 13.76 0 0 0 0-18.56 12.224 12.224 0 0 0-8.832-3.84 12.16 12.16 0 0 0-8.768 3.84 13.696 13.696 0 0 0 0 18.56zM552.32 1018.24c3.456 3.648 8.32 5.76 13.184 5.76a18.368 18.368 0 0 0 13.184-5.76 20.608 20.608 0 0 0 0-27.968 18.368 18.368 0 0 0-13.184-5.824 18.368 18.368 0 0 0-13.184 5.76 20.608 20.608 0 0 0 0 28.032z m-198.336-5.76c4.608 4.8 11.072 7.68 17.6 7.68a24.448 24.448 0 0 0 17.536-7.68 27.456 27.456 0 0 0 0-37.248 24.448 24.448 0 0 0-17.536-7.68 24.448 24.448 0 0 0-17.6 7.68 27.52 27.52 0 0 0 0 37.184z m-175.68-91.84c5.76 6.08 13.824 9.6 21.952 9.6a30.592 30.592 0 0 0 22.016-9.6 34.368 34.368 0 0 0 0-46.592 30.592 30.592 0 0 0-22.016-9.6 30.592 30.592 0 0 0-21.952 9.6 34.368 34.368 0 0 0 0 46.592z m-121.152-159.36c6.912 7.36 16.64 11.648 26.368 11.648a36.736 36.736 0 0 0 26.432-11.584 41.28 41.28 0 0 0 0-55.936 36.736 36.736 0 0 0-26.432-11.584 36.8 36.8 0 0 0-26.368 11.52 41.28 41.28 0 0 0 0 56zM12.736 564.672a42.88 42.88 0 0 0 30.784 13.44 42.88 42.88 0 0 0 30.784-13.44 48.128 48.128 0 0 0 0-65.216 42.88 42.88 0 0 0-30.72-13.44 42.88 42.88 0 0 0-30.848 13.44 48.128 48.128 0 0 0 0 65.216z m39.808-195.392a48.96 48.96 0 0 0 35.2 15.36 48.96 48.96 0 0 0 35.2-15.36 54.976 54.976 0 0 0 0-74.56 48.96 48.96 0 0 0-35.2-15.424 48.96 48.96 0 0 0-35.2 15.424 54.976 54.976 0 0 0 0 74.56zM168.32 212.48c10.368 11.008 24.96 17.408 39.68 17.408 14.592 0 29.184-6.4 39.552-17.408a61.888 61.888 0 0 0 0-83.84 55.104 55.104 0 0 0-39.616-17.408c-14.656 0-29.248 6.4-39.616 17.408a61.888 61.888 0 0 0 0 83.84zM337.344 124.8c11.52 12.16 27.712 19.264 43.968 19.264 16.256 0 32.448-7.04 43.968-19.264a68.672 68.672 0 0 0 0-93.184 61.248 61.248 0 0 0-43.968-19.264 61.248 61.248 0 0 0-43.968 19.264 68.736 68.736 0 0 0 0 93.184z m189.632-1.088c12.672 13.44 30.528 21.248 48.448 21.248s35.712-7.808 48.384-21.248a75.584 75.584 0 0 0 0-102.464A67.392 67.392 0 0 0 575.36 0c-17.92 0-35.776 7.808-48.448 21.248a75.584 75.584 0 0 0 0 102.464z m173.824 86.592c13.824 14.592 33.28 23.104 52.736 23.104 19.584 0 39.04-8.512 52.8-23.104a82.432 82.432 0 0 0 0-111.744 73.472 73.472 0 0 0-52.8-23.168c-19.52 0-38.912 8.512-52.736 23.168a82.432 82.432 0 0 0 0 111.744z m124.032 158.528c14.976 15.872 36.032 25.088 57.216 25.088 21.12 0 42.24-9.216 57.152-25.088a89.344 89.344 0 0 0 0-121.088 79.616 79.616 0 0 0-57.152-25.088c-21.184 0-42.24 9.216-57.216 25.088a89.344 89.344 0 0 0 0 121.088z m50.432 204.032c16.128 17.088 38.784 27.008 61.632 27.008 22.784 0 45.44-9.92 61.568-27.008a96.256 96.256 0 0 0 0-130.432 85.76 85.76 0 0 0-61.568-27.072c-22.848 0-45.44 9.984-61.632 27.072a96.192 96.192 0 0 0 0 130.432z" fill="#262626" p-id="5423"></path></svg>
			`
			function init (list) {
				if ( !list || list.length == 0 ) return
				mySwiper = new Swiper('.swiper', {
				  direction: 'vertical', // 垂直切换选项
				  loop: false, // 循环模式选项
				  virtual: {
				    slides: list,
					cache: false,//关闭缓存
				    renderSlide:function(slide, index){
						return renderVideo(slide, index);
				    }
				  },
				  //事件监听
				  on: {
					init: function () {
					  this.emit('slideChangeTransitionEnd')
					  const loadings = document.getElementsByClassName('swiper-loading')
					  for ( let i = 0; i < loadings.length; i++ ) {
						  loadings[i].innerHTML = loadingIcon + '<span class="swiper-' + (i == 0 ? 'pulldown' : 'pullup') + '-span"></span>'
					  }
					},
					slideChange: function () {
						var prevprevIndex = this.activeIndex - 2
						var prevprevItem = document.querySelector('#slide_' + prevprevIndex)
						var prevprevVideo = prevprevItem && prevprevItem.getElementsByTagName('video')[0]
						if ( prevprevVideo ) unloadVideo(prevprevIndex)
						var nextnextIndex = this.activeIndex + 2
						var nextnextItem = document.querySelector('#slide_' + nextnextIndex)
						var nextnextVideo = nextnextItem && nextnextItem.getElementsByTagName('video')[0]
						if ( nextnextVideo ) unloadVideo(nextnextIndex)
					},
				    slideChangeTransitionEnd: function(swiper){
					  var slides = swiper.virtual?.slides
					  var item = document.querySelector('#slide_' + this.activeIndex)
					  var video = item && item.getElementsByTagName('video')[0]
					  if ( video ) video.play()
					  else loadVideo(this.activeIndex, slides)
					  var nextIndex = this.activeIndex + 1
					  var nextItem = document.querySelector('#slide_' + nextIndex)
					  var nextVideo = nextItem && nextItem.getElementsByTagName('video')[0]
					  if ( nextVideo ) nextVideo.pause()
					  else loadVideo(nextIndex, slides)
					  var prevIndex = this.activeIndex - 1
					  var prevItem = document.querySelector('#slide_' + prevIndex)
					  var prevVideo = prevItem && prevItem.getElementsByTagName('video')[0]
					  if ( prevVideo ) prevVideo.pause()
					  else loadVideo(prevIndex, slides)
					  if( !nextItem ) pulluping() //没有下一条数据，去预加载
					  uni.postMessage({data: {change: this.activeIndex}})
				    },
					touchStart: function (swiper, event) {
						touchstartY = event.pageY
					},
					touchMove: function (swiper, event) {
						var touch = event.touches[0]
						var offset = touch.pageY - touchstartY
						if ( this.activeIndex == 0 && offset > 0 ) pulldown(offset)
						if ( this.activeIndex == swiper.virtual?.slides.length - 1 && offset < 0 ) pullup(offset)
					},
					touchEnd: function (swiper, event) {
						if ( pulldownState == 'ready' ) pulldowning()
						if ( pullupState == 'ready' ) pulluping()
					}
				  },
				  // 如果需要分页器
				  // pagination: {
				  //   el: '.swiper-pagination',
				  // },
				})
				mySwiper.virtual.update(); // 更新虚拟幻灯片
				mySwiper.update();
			}
			
			function renderVideo (slide, index) {
				return `
					<div class="swiper-slide slide_item" id="slide_${index}">
						<div class="swiper-slide-wrapper"></div>
						<div class="video_bottom">
							<div class="video_info">
								<span class="title" style="display: ${slide.title ? 'inline' : 'none'}">${slide.title}</span>
								<span class="subtitle" style="display: ${slide.subtitle ? 'inline' : 'none'}">${slide.subtitle}</span>
								<span class="description" style="display: ${slide.description ? 'inline' : 'none'}">${slide.description}</span>
							</div>
							<div class="controls">
								<div class="controls_range_box">
									<div class="controls_range_track"></div>
									<div class="controls_range_focus"></div>
									<input class="controls_range" type="range" value="0" min="0" max="100" />
								</div>
								<div class="controls_bottom">
									<span class="controls_toggle">
										${playIcon}
									</span>
									<span class="controls_time">加载中</span>
									${slide.moreShow ? `
										<span class="controls_more">
											${YbPlayer.moreIcon}
										</span>
									` : ''}
									<span class="btn controls_list">
										<svg t="1762400435952" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8100" width="48" height="48"><path d="M108.612267 247.005867a68.266667 68.266667 0 0 1 68.266666-68.266667h235.8272a68.266667 68.266667 0 0 1 68.266667 68.266667v239.940266a68.266667 68.266667 0 0 1-68.266667 68.266667H176.878933a68.266667 68.266667 0 0 1-68.266666-68.266667v-239.957333zM543.0272 773.000533a68.266667 68.266667 0 0 0 68.266667 68.266667h235.844266a68.266667 68.266667 0 0 0 68.266667-68.266667V533.060267a68.266667 68.266667 0 0 0-68.266667-68.266667H611.2768a68.266667 68.266667 0 0 0-68.266667 68.266667v239.940266zM108.612267 683.6736a68.266667 68.266667 0 0 1 68.266666-68.266667h235.8272a68.266667 68.266667 0 0 1 68.266667 68.266667v89.344a68.266667 68.266667 0 0 1-68.266667 68.266667H176.878933a68.266667 68.266667 0 0 1-68.266666-68.266667v-89.344zM543.0272 336.3328a68.266667 68.266667 0 0 0 68.266667 68.266667h235.844266a68.266667 68.266667 0 0 0 68.266667-68.266667v-89.344a68.266667 68.266667 0 0 0-68.266667-68.266667H611.2768a68.266667 68.266667 0 0 0-68.266667 68.266667v89.344z" p-id="8101"></path></svg>
									</span>
									<span class="btn controls_download">
										${downloadIcon}
									</span>
									<span class="btn controls_voice">
										${voiceIcon}
									</span>
									<span class="btn controls_screen">
										${openfullIcon}
									</span>
								</div>
							</div>
						</div>
					</div>
				`
			}
			
			//加载视频
			function loadVideo (index, list, initialTime) {
				var item = document.querySelector('#slide_' + index)
				if ( item ) {
					var video = item.getElementsByTagName('video')[0], barrage, controlsTimer, isSeeking = false
					if ( !video ) {
						var slide = list[index]
						var toggleEl = item.getElementsByClassName('controls_toggle')[0]
						var screenEl = item.getElementsByClassName('controls_screen')[0]
						var timeEl = item.getElementsByClassName('controls_time')[0]
						var rangeEl = item.getElementsByClassName('controls_range')[0]
						var rangeboxEl = item.getElementsByClassName('controls_range_box')[0]
						var rangefocusEl = item.getElementsByClassName('controls_range_focus')[0]
						var downEl = item.getElementsByClassName('controls_download')[0]
						var voiceEl = item.getElementsByClassName('controls_voice')[0]
						var moreEl = item.getElementsByClassName('controls_more')[0]
						var listEl = item.getElementsByClassName('controls_list')[0]
						var wrapperEl = item.getElementsByClassName('swiper-slide-wrapper')[0]
						var myPlayer = new YbPlayer({
							container: wrapperEl,
							src: slide.src,
							title: slide.title,
							poster: slide.poster,
							type: slide.type,
							isLive: slide.isLive,
							loop: slide.loop,
							height: 'auto',
							danmu: slide.barrages,
							custom: {
								disableBottomProgress: true,
								gesture: {
									initialVolume,
									initialLight,
									disableLight: true,
									disableVolume: true,
									disableProgress: true
								},
								danmu: {
									fontScale: 0.7,
									fontSize: 25
								}
							},
							decoder: {
								hls: {
									loader: Hls
								},
								flv: {
									loader: flvjs
								}
							}
						})
						
						if ( slide.isLive ) rangeboxEl.style.display = 'none'
						myPlayer.load()
						myPlayer.loadVideo()
						myPlayer.loadGestureEvent()
						if ( slide.barrages && slide.barrages.length > 0 ) myPlayer.loadDanmu()
						myPlayer.on('singleclick', function () {
							if ( !myPlayer.getFullscreen() ) myPlayer.toggle()
						})
						myPlayer.on('play', function () {
							toggleEl.innerHTML = pauseIcon
						})
						myPlayer.on('pause', function () {
							toggleEl.innerHTML = playIcon
						})
						myPlayer.on('loadedmetadata', function () {
							var video = myPlayer.video
							if ( index == 0 ) video.play()
							if ( initialTime ) video.currentTime = initialTime
							rangeEl.value = 0
							if ( slide.isLive )  timeEl.innerHTML = '直播中 · 00:00'
							else timeEl.innerHTML = '00:00 / ' + YbPlayer.timeFormat(video.duration)
							
							var height = document.body.offsetHeight
							var videoWidth = video.videoWidth
							var videoHeight = video.videoHeight
							var ratio = videoWidth / videoHeight
							var defaultHeight = height - item.getElementsByClassName('controls')[0].offsetHeight
							switch (ratio) {
								case 9/16://竖屏，常见竖屏比例，不用做处理
									break;
								case 6/7://竖屏，这个竖屏可能接近横屏，所以设置容器高度，让视频居中显示
									wrapperEl.style.height = defaultHeight + 'px'
									break;
								case 16/9://常见横屏比例，设置容器高度，让视频居中显示
									wrapperEl.style.height = defaultHeight + 'px'
									break;
								case 2.35/1://横屏比例，不常见的比例，设置容器高度，让视频居中显示
									wrapperEl.style.height = defaultHeight + 'px'
									break;
								default:
									if( ratio > 6/7 ) {//视频比例大于这个比例，让视频居中显示
										wrapperEl.style.height = defaultHeight + 'px'
									}
							}
						})
						myPlayer.on('timeupdate', function () {
							var video = myPlayer.video
							if ( slide.isLive )  timeEl.innerHTML = '直播中 · ' + YbPlayer.timeFormat(video.currentTime)
							else timeEl.innerHTML = YbPlayer.timeFormat(video.currentTime) + ' / ' + YbPlayer.timeFormat(video.duration)
							if ( !isSeeking ) {
								rangeEl.value = (video.currentTime / video.duration) * 100
								rangefocusEl.style.width = rangeEl.value + '%'
							}
						})
						myPlayer.on('ended', function () {
							if ( !slide.loop ) mySwiper.slideNext()
						})
						myPlayer.on('fullscreenchange', function () {
							if ( myPlayer.getFullscreen() ) {
								myPlayer.setGesture('disableVolume', false)
								myPlayer.setGesture('disableLight', false)
								myPlayer.setConfig('controls', true)
								mySwiper.disable()
							} else {
								myPlayer.setGesture('disableVolume', true)
								myPlayer.setGesture('disableLight', true)
								myPlayer.setConfig('controls', false)
								mySwiper.enable()
							}
						})
						screenEl.onclick = function () {
							myPlayer.openFullscreen('auto')
						}
						toggleEl.onclick = function () {
							myPlayer.toggle()
						}
						downEl.onclick = function () {
							uni.postMessage({ data: { download: mySwiper?.activeIndex } });
						}
						voiceEl.onclick = function () {
							uni.postMessage({ data: { voice: 1 } });
						}
						listEl.onclick = function () {
							uni.postMessage({ data: { list: 1 } });
						}
						if ( moreEl ) {
							moreEl.onclick = function () {
								uni.postMessage({ data: { more: 1 } });
							}
						}
						rangeEl.oninput = function () {
							var video = myPlayer.video
							isSeeking = true
							timeEl.innerHTML = YbPlayer.timeFormat((rangeEl.value / 100) * video.duration) + ' / ' + YbPlayer.timeFormat(video.duration)
							rangefocusEl.style.width = rangeEl.value + '%'
						}
						rangeEl.onchange = function () {
							var video = myPlayer.video
							video.currentTime = (rangeEl.value / 100) * video.duration
							isSeeking = false
						}
						loadedVideos.set(index, myPlayer)
					}
				}
			}
			
			//卸载视频，回收内存
			function unloadVideo (index) {
				if ( loadedVideos.has(index) ) {
					var videoData = loadedVideos.get(index);
					videoData.unloadGestureEvent()
					videoData.unloadVideo()//卸载视频，释放视频资源
					videoData.unloadDanmu()//卸载弹幕
					videoData.unload()//销毁插件
					loadedVideos.delete(index)
				}
			}
			
			function pulldown (offset) {
				if ( pulldownState == 'loading' ) return
				var pulldownEl = document.getElementsByClassName('swiper-pulldown-span')[0]
				if ( pulldownEl ) {
					pulldownEl.innerHTML = offset > 300 ? '释放刷新' : '下拉刷新'
					pulldownState = offset > 300 ? 'ready' : 'pulldown'
				}
			}
			
			function pulldowning () {
				if ( pulldownState == 'loading' ) return
				var pulldownEl = document.getElementsByClassName('swiper-pulldown-span')[0]
				if ( pulldownEl ) pulldownEl.innerHTML = '正在刷新中'
				pulldownState = 'loading'
				uni.postMessage({ data: { pulldown: 1 } });
			}
			
			function pullup (offset) {
				if ( ['loading', 'end'].includes(pullupState) ) return
				var pullupEl = document.getElementsByClassName('swiper-pullup-span')[0]
				if ( pullupEl ) {
					pullupEl.innerHTML = offset < -300 ? '释放加载' : '上拉加载'
					pullupState = offset < -300 ? 'ready' : 'pullup'
				}
			}
			
			function pulluping () {
				if ( ['loading', 'end'].includes(pullupState) ) return
				var pullupEl = document.getElementsByClassName('swiper-pullup-span')[0]
				if ( pullupEl ) pullupEl.innerHTML = '正在加载中'
				pullupState = 'loading'
				uni.postMessage({ data: { pullup: 1 } });
			}
			
			function setPulldown (state) {
				if ( timeList && timeList.length > 0 ) {
					loadedVideos.forEach((value, key) => {//刷新数据前，先卸载所有视频，避免内存泄露
						unloadVideo(key)
					})
					loadedVideos = new Map()
					mySwiper?.virtual?.removeAllSlides()
					mySwiper?.destroy(true, true)//销毁swiper
					mySwiper = null
					init(timeList)
				}
				var pulldownEl = document.getElementsByClassName('swiper-pulldown-span')[0]
				if ( pulldownEl ) pulldownEl.innerHTML = '下拉刷新'
				pulldownState = 'pulldown'
				timeList = []
			}
			
			function setPullup (state) {
				if ( timeList && timeList.length > 0 ) {
					var activeIndex	= mySwiper.activeIndex
					var videoData = loadedVideos.get(activeIndex)
					var currentTime = videoData.video.currentTime
					loadedVideos.forEach((value, key) => {//刷新数据前，先卸载所有视频，避免内存泄露
						unloadVideo(key)
					})
					loadedVideos = new Map()
					mySwiper.virtual.appendSlide(timeList)
					loadVideo(activeIndex, mySwiper.virtual.slides, currentTime)
					mySwiper.emit('slideChangeTransitionEnd')
				}
				var pullupEl = document.getElementsByClassName('swiper-pullup-span')[0]
				if ( state == 'end' ) {
					if ( pullupEl ) pullupEl.innerHTML = '数据全部加载完毕'
					pullupState = 'end'
				} else {
					if ( pullupEl ) pullupEl.innerHTML = '上拉加载'
					pullupState = 'pullup'
				}
				timeList = []
			}
			//记录列表
			function setTimeList (arg) {
				var list = JSON.parse(decodeURIComponent(decodeURIComponent(arg)))
				timeList = timeList.concat(list)
				uni.postMessage({data: {timeListEnd: timeList.length } })
			}
			
			function clearData () {
				loadedVideos.forEach((value, key) => {//刷新数据前，先卸载所有视频，避免内存泄露
					unloadVideo(key)
				})
				loadedVideos = new Map()
				mySwiper?.virtual?.removeAllSlides()
				mySwiper?.destroy(true, true)//销毁swiper
				mySwiper = null
			}
			
			function setInitial (arg) {
				var { volume, light } = JSON.parse(decodeURIComponent(arg))
				initialVolume = volume
				initialLight = light
				loadedVideos.forEach((value,key) => {
					var videoData = loadedVideos.get(key)
					if ( videoData ) {
						videoData.setGesture('initialVolume', volume)
						videoData.setGesture('initialLight', light)
					}
				})
			}
			//滑动到指定位置
			function slideTo (current) {
				if ( mySwiper ) {
					mySwiper.slideTo(current, 0, false)
					setTimeout(() => {
						//slideTo不会触发slideChangeTransitionEnd，需要手动触发
						mySwiper.emit('slideChangeTransitionEnd')
					}, 100)
				}
			}
			
			//消息提示
			function showToast (arg) {
				var data = JSON.parse(decodeURIComponent(arg))
				var activeIndex	= mySwiper.activeIndex
				var videoData = loadedVideos.get(activeIndex)
				if ( videoData ) videoData.showToast(data)
			}
			
			function play () {
				var activeIndex	= mySwiper.activeIndex
				var videoData = loadedVideos.get(activeIndex)
				if ( videoData ) videoData.video.play()
			}
			
			function pause () {
				var activeIndex	= mySwiper.activeIndex
				var videoData = loadedVideos.get(activeIndex)
				 if ( videoData ) videoData.video.pause()
			}
			
			window.onload = function () {
				uni.postMessage({ data: { ready: 1 } });
			}
		</script>
	</body>
</html>